<template>
    <div class="clearfix fb-control"
         v-if="unit.visible">
        <label class="col-sm-2 control-label">{{ unit.label }}</label>
        <div class="col-sm-10">
            {{ unit.padLeft }}
            <input type="text"
                   :id="unit.id"
                   class="k-textbox"
                   :class="[unit.extraClass]"
                   :value="unit.defaultValue"
                   :placeholder="unit.placeholder"
                   :disabled="unit.disabled">
            {{ unit.padRight }}
            <span class="help-block" v-if="unit.helpText">{{ unit.helpText }}</span>
        </div>
    </div>
</template>
<script>
    export default {
        name: 'TextboxUnit',
        props: ['unit']
    }
</script>
